@extends('admin.layouts.header_other')
@section('title',"后台管理系统")
@section('content')
    <table class="layui-hide" id="test" lay-filter="test"></table>
    <script type="text/html" id="toolbarDemo">
        <div class="">
            <div class="layui-input-item">
                <div class="layui-inline">
                    <button class="layui-btn layui-btn-sm padding_top" lay-event="countyOutAdd">添加</button>
                </div>
                <div  class="layui-inline">
                    <input type="text" name="title" id="title" value="" placeholder="请输入标题" autocomplete="on" class="layui-input serach_input layui-btn-sm ">
                </div>
                <div class="layui-inline serach_input">
                    <select name="interest" lay-filter="aihao" class="layui-btn-sm" id="is_check">
                        <option></option>
                        <option value="1">审核</option>
                        <option value="2">待审核</option>
                    </select>
                </div>
                <div class="layui-inline  serach_input ">
                    <select name="interest1" lay-filter="aihao" id="is_publish">
                        <option></option>
                        <option value="1">已发布</option>
                        <option value="2">待发布</option>
                    </select>
                </div>
                <div class="layui-inline">
                    <input type="text" name="start_date" id="start_date" placeholder="开始日期" autocomplete="on" class="layui-input serach_input layui-btn-sm">
                </div>
                <div class="layui-inline  ">
                    <input type="text" name="end_date" id="end_date" placeholder="结束日期" autocomplete="on" class="layui-input serach_input layui-btn-sm">
                </div>
                <div class="layui-inline">
                    <button class="layui-btn layui-btn-sm padding_top"  id="countryInSearchBtn">搜索</button>
                </div>
            </div>

        </div>
    </script>
    <script type="text/html" id="switchTpl">
        <input type="checkbox" name="sex" value="" lay-skin="switch" lay-text="发布|未发布" lay-filter="">
    </script>
    <script type="text/html" id="barDemo">
        <a class="layui-btn layui-btn-xs" lay-event="edit">编辑</a>
        <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del">删除</a>
    </script>
    <script src="{{asset('attach/js/layui.all.js')}}"></script>
    <!-- 注意：如果你直接复制所有代码到本地，上述js路径需要改成你本地的 -->
    <script>
        layui.use(['table','jquery'], function(){
            var table = layui.table;
            var form = layui.form;
            var laydate = layui.laydate;
            var $ = layui.$;
            laydate.render({
                elem: "#start_date"
                ,type: 'datetime'
            });
            laydate.render({
                elem: "#end_date"
                ,type: 'datetime'
            });
            var datatable=table.render({
                elem: '#test'
                ,url:'{{route('admin.material.getlist')}}'
                ,toolbar: '#toolbarDemo'
                ,title: '国际新闻列表'
                ,cols: [[
                    {type: 'checkbox', fixed: 'left'}
                    ,{field:'id', title:'ID', width:80, fixed: 'left', unresize: true, sort: true}
                    ,{field:'title', title:'标题',width:240,sort:true}
                    ,{field:'serial', title:'编号', width:150}
                    ,{field:'images', title:'默认素材', width:110, sort: true,templet:function (d) {
                            return "<img src='"+d.images+"' width='80' height='80' />";
                        }}
                    ,{field:'sizeorresol', title:'尺寸/分辨率', width:150, sort: true}
                    ,{field:'price', title:'价格', width:80, sort: true}
                    ,{field:'file_size', title:'文件大小', width:110, sort: true}
                    ,{field:'is_check', title:'审核', width:100,sort:true, templet:function (d) {
                            var str='';
                            str = "<input type='checkbox' data-attr='"+d.id+"'  name='is_check' value='"+d.is_check+"' lay-skin='switch' lay-text='审核|待审核' lay-filter='is_check' ";
                            if(d.is_check==1){
                                str+="checked";
                            }
                            str+=">";
                            return str;
                        }}
                    ,{field:'status', title:'是否发布',width:100, templet:function (d) {
                            var str='';
                            str = "<input type='checkbox' data-attr='"+d.id+"'  name='status' value='"+d.status+"' lay-skin='switch' lay-text='是|否' lay-filter='status' ";
                            if(d.status==1){
                                str+="checked";
                            }
                            str+=">";
                            return str;
                        }}
                    ,{field:'created_at', title:'创建时间',width:180}
                    ,{field:'updated_at', title:'更新时间',width:180}
                    ,{fixed: 'right', title:'操作', toolbar: '#barDemo'}
                ]]
                ,page: true
                ,loading:true
                ,size:'lg'
            });

            //头工具栏事件
            table.on('toolbar(test)', function(obj){
                var checkStatus = table.checkStatus(obj.config.id);
                switch(obj.event){
                    case 'getCheckData':
                        var data = checkStatus.data;
                        layer.alert(JSON.stringify(data));
                        break;
                    case 'getCheckLength':
                        var data = checkStatus.data;
                        layer.msg('选中了：'+ data.length + ' 个');
                        break;
                    case 'countyOutAdd':
                        var openwin=layer.open({
                            type:2,
                            title:"素材添加",
                            content:"{{route('admin.material.add')}}",
                            area:['100%','100%'],
                            maxmin:true,
                        });
                        layer.full(openwin);
                        break;
                };
            });
            form.on('switch(is_check)', function(obj){
                var is_check = obj.value==1 ? 2 : 1;
                $.ajax({
                    type:'post',
                    url:'{{route('admin.countryout.ischeck')}}',
                    data:{id:obj.elem.dataset.attr,_token:$('meta[name="_token"]').attr('content'),'is_check':is_check},
                    dataType : "json",
                    headers: {
                        'X-CSRF-TOKEN': $('meta[name="_token"]').attr('content')
                    },
                    success:function (data) {
                        if(data.code==200){
                            layer.msg(data.msg,{
                                icon:6,
                                time:2000
                            },function () {
                                // location.reload();//刷新父页面
                            });
                        }else{
                            layer.msg(data.msg,{icon:5});
                            return;
                        }
                    }
                });
            });
            form.on('switch(status)', function(obj){
                var is_status= obj.value==1 ? 2 : 1;
                $.ajax({
                    type:'post',
                    url:'{{route('admin.countryout.isstatus')}}',
                    data:{id:obj.elem.dataset.attr,_token:$('meta[name="_token"]').attr('content'),'status':is_status},
                    dataType : "json",
                    headers: {
                        'X-CSRF-TOKEN': $('meta[name="_token"]').attr('content')
                    },
                    success:function (data) {
                        if(data.code==200){
                            layer.msg(data.msg,{
                                icon:6,
                                time:2000
                            },function () {
                                //location.reload();//刷新父页面
                            });
                        }else{
                            layer.msg(data.msg,{icon:5});
                            return;
                        }
                    }
                });
            });

            //监听行工具事件
            table.on('tool(test)', function(obj){
                var data = obj.data;
                console.log(obj)
                if(obj.event === 'del'){
                    var url='{{route('admin.material.del')}}',
                        data={id:obj.data.id,_token:$('meta[name="_token"]').attr('content')};
                    $.ajax({
                        type:'post',
                        url:url,
                        data:data,
                        dataType : "json",
                        headers: {
                            'X-CSRF-TOKEN': $('meta[name="_token"]').attr('content')
                        },
                        success:function (data) {
                            if(data.code==200){
                                layer.msg(data.msg,{
                                    icon:6,
                                    time:2000
                                },function () {
                                    location.reload();//刷新父页面
                                });
                            }else{
                                layer.msg(data.msg,{icon:5});
                                return;
                            }
                        }
                    });
                } else if(obj.event === 'edit'){
                    var openwin=layer.open({
                        type:2,
                        title:"编辑素材",
                        content:"{{route('admin.material.edit')}}"+'/'+obj.data.id,
                        area:['100%','100%'],
                        maxmin:true,
                        success: function(layero, index){
                            // console.log(layero);
                            // var body = layer.getChildFrame('body', index);
                            // var iframeWin = window[layero.find('iframe')[0]['name']];
                            // body.find('input[name=title]').val(obj.data.title);
                            // body.find('input[name=subtitle]').val(obj.data.subtitle);
                            // body.find('input[name=key_seo]').val(obj.data.key_seo);
                            // body.find('textarea[name=key_description]').text(obj.data.key_description);
                            // body.find("input[name=status][value="+obj.data.status+"]").attr("checked",'checked');
                            // body.find(".parent_id").find("option[value="+obj.data.parent_id+"]").attr("selected",true);
                            // body.find('input[name=psort]').val(obj.data.psort);
                            // body.find('input[name=menu_route]').val(obj.data.menu_route);
                            // body.find('textarea[name=routes]').val(obj.data.routes);
                            // body.find('textarea[name=description]').val(obj.data.description);
                        }
                    });
                    layer.full(openwin);
                }
            });

            //souso
            $("#countryInSearchBtn").click(function () {
                var title = $("#title").val(),
                    is_check = $("#is_check").val(),
                    is_publish = $("#is_publish").val(),
                    start_date  = $("#start_date").val(),
                    end_date = $("#end_date").val();
                datatable.reload({
                    where:{title:title,is_check:is_check,is_publish:is_publish,start_date:start_date,end_date:end_date},
                    page:{curr:1}
                })
            });
        });
    </script>
@endsection
